<template>
  <div class="main_style">
    <crumbs :BreadCrumb="BreadCrumb"></crumbs>
    <div style="overflow: hidden; margin-bottom: 25px; padding: 5px">
      <el-form
          :inline="true"
          :model="handTableForm"
          class="demo-form-inline text-center"
          @submit.native.prevent
      >
        <el-form-item label="体检单号">
          <el-input v-model="handTableForm.orderNo" @keyup.enter.native="getList"></el-input>
        </el-form-item>
        <el-button @click="getList" type="primary">交表</el-button>
        <el-checkbox v-model="checked" class="checked">是否弃检确认</el-checkbox>
      </el-form>
    </div>

    <el-form
        :inline="true"
        :model="searchForm"
        class="demo-form-inline text-center"
        @submit.native.prevent
    >
      <el-form-item label="体检单号">
        <el-input v-model="searchForm.orderNo"></el-input>
      </el-form-item>
      <el-form-item label="姓名">
        <el-input v-model="searchForm.customerName"></el-input>
      </el-form-item>
      <el-form-item label="单位">
        <el-input v-model="searchForm.company"></el-input>
      </el-form-item>
      <el-form-item label="二级部门">
        <el-input v-model="searchForm.company"></el-input>
      </el-form-item>
      <el-form-item class="staff_form_btn">
        <el-button @click="getpor" type="primary">查询</el-button>
      </el-form-item>
    </el-form>
    <div class="title1"><h3> 已交表名单 ({{ todayInTableCount }}) </h3></div>

    <el-table :data="scanCodeInfo.records" border class="smjbtablestyle" :header-cell-style="headerstyle">
      <!-- <el-table-column prop="name" label="序号"></el-table-column> -->
      <el-table-column align="center" prop="orderNo" label="体检单号" width="150"></el-table-column>
      <el-table-column align="center" prop="customerName" label="姓名" width="80"></el-table-column>
      <el-table-column align="center" prop="sex" label="性别" width="80"></el-table-column>
      <el-table-column align="center" prop="age" label="年龄" width="80"></el-table-column>
      <el-table-column align="center" prop="telephone" label="联系方式" width="150"></el-table-column>
      <el-table-column align="center" prop="credNum" label="证件号" width="150">
        <template slot-scope="scope">
          {{ scope.row.credNum|formatCredNum }}
        </template>
      </el-table-column>
      <el-table-column align="center" prop="enterpriseName" label="单位名称/二级部门">
        <template slot-scope="scope">
          {{ scope.row.enterpriseName }} {{scope.row.deptName}}}
        </template>
      </el-table-column>
      <el-table-column align="center" prop="contractName" label="合同名称"></el-table-column>
      <el-table-column align="center" prop="groupName" label="分组"></el-table-column>
      <el-table-column align="center" prop="signDatetime" label="登记时间" width="150">
        <template slot-scope="scope">
          {{ scope.row.signDatetime|formatDate }}
        </template>
      </el-table-column>
      <el-table-column align="center" prop="editTime" label="交表时间" width="150">
        <template slot-scope="scope">
          {{ scope.row.editTime|formatDate }}
        </template>
      </el-table-column>
    </el-table>
    <div class="pagination">
      <el-pagination
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          :current-page="pageNo"
          :page-sizes="[10, 20, 30, 40]"
          :page-size="pageSize"
          layout="total, sizes, prev, pager, next, jumper"
          :total="total"
      >
      </el-pagination>
    </div>

    <el-dialog title="未检项目确认" :visible.sync="confirmVisble" width="700px" append-to-body>
      <div>
        <el-form :inline="true">
          <el-form-item label="姓名 :" class="toptitle">{{ peCustomers.customerName }}</el-form-item>
          <el-form-item label="性别 :" class="toptitle">{{ peCustomers.sex }}</el-form-item>
          <el-form-item label="年龄 :" class="toptitle">{{ peCustomers.age }}</el-form-item>
          <el-form-item label="单位 :" class="toptitle">{{ peCustomers.company }}</el-form-item>
          <el-form-item label="部门 :" class="toptitle">{{ peCustomers.deptname }}</el-form-item>
        </el-form>
      </div>
      <el-table :data="ItemsList" border ref="selections">
        <el-table-column type="selection" width="55"></el-table-column>
        <el-table-column prop="deptName" label="科室" width="130"></el-table-column>
        <el-table-column prop="itemName" label="项目"></el-table-column>
      </el-table>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="editgroupinfo">确 定</el-button>
        <el-button @click="confirmVisble = false">取 消</el-button>
      </div>
    </el-dialog>

  </div>
</template>
<script>
import crumbs from "@src/views/Crumbs";
import {formatTimeToStr} from "@src/common/utils/date";

export default {
  components: {
    crumbs,
  },
  name: "confirm",
  data() {
    return {
      BreadCrumb: [
        {path: "", name: "检中管理"},
        {path: "/visitphysician/confirm", name: "交表确认"},
      ],
      handTableForm: {},
      searchForm: {
        "medicalDate": 1,//必传获取今日的数据
        "status": 8 //必传获取已交表的数据
      },
      scanCodeInfo: {},
      scanCodeInfoTotal: [],
      confirmVisble: false,
      ItemsList: [],
      peCustomers: {},
      orderId: '',
      headerstyle: {
        color: '#000',
        background: '#f2f2f2',
      },
      pageSize: 10,
      pageNo: 1,
      total: 0,
      todayInTableCount: 0,
      checked: false
    }
  },
  filters: {
    formatDate: function (time) {
      if (time != null && time !== "") {
        var date = new Date(time);
        return formatTimeToStr(date, "yyyy-MM-dd hh:mm");
      } else {
        return "";
      }
    },
    formatCustomerStatus: function (val) {
      var dict = {1: "正常", 2: "无效", 3: "限制", 4: "拉黑", 5: "死亡"}
      return dict[val]
    },
    formatSex: function (val) {
      var dict = {1: "男", 2: "女"}
      return dict[val]
    },
    formatCredNum: function (val) {
      if (val !== null) {
        return val.replace(/^(.{6})(?:\d+)(.{4})$/, "\$1****\$2")
      }
      return val
    },
  },
  created() {
    // this.getCount()
    this.getpor()
  },
  methods: {
    getList() {
      this.$axios.getPeExamRecordDetail({"orderNo": this.handTableForm.orderNo}).then(res => {
        if (res.code === "00000") {
          if (res.data.peOrdersMain == null || res.data.peOrdersMain.status === 1) {
            this.$message({
              message: '单号无效，无法交表',
              type: 'warning'
            });
          } else {
            if (this.checked) {
              this.$axios.validNoCheckItem({"orderNo": this.handTableForm.orderNo})
                  .then(res => {
                    if (res.code === "00000") {
                      this.orderId = res.data.orderId
                      if (!res.data.flag) {
                        this.updata()
                      } else {
                        this.ItemsList = res.data.pbExamItemsList
                        this.peCustomers = res.data.peCustomers
                        this.confirmVisble = true
                      }
                    }
                  })
            } else {
              this.updata()
            }
          }
        }
      })
      // 选中是否弃检确认按钮，开始查看是否有弃检项，不选中直接提交

    },
    // 列表获取
    getpor() {
      this.$axios.receiveFormCheckList({
        ...this.searchForm,
        pageSize: this.pageSize,
        pageNo: this.pageNo,
      }).then(res => {
        if (res.code === '00000') {
          this.scanCodeInfo = res.data
        }
      })
    },
    // 交表
    updata() {
      this.$axios.updateScanCodeStatus({"orderNo": this.handTableForm.orderNo}).then(res => {
        if (res.code === "00000") {
          this.$message({
            message: '交表成功',
            type: 'success'
          });
          this.getpor()
          // this.getCount()
          this.handTableForm.orderNo = ""
        } else {
          this.$message.error('交表未完成，请重新交表');
        }
      })
    },
    // 人数统计
    getCount() {
      this.$axios.getScanCodePersonCount({}).then(res => {
        if (res.code === '00000') {
          // this.scanCodeInfo = res.data
          this.scanCodeInfoTotal = [
            {
              todayCheckCount: res.data.todayCheckCount,
              todayInTableCount: res.data.todayInTableCount,
              todayNoTableCount: res.data.todayNoTableCount,
            }
          ]
          this.todayInTableCount = res.data.todayInTableCount
        }
      })
    },
    // 放弃体检项
    editgroupinfo() {
      let arr = []
      this.$refs.selections.selection.forEach(element => {
        arr.push(element.id)
      });
      this.$axios.updateNoCheckItemStatus({
        itemList: arr,
        orderId: this.orderId
      }).then(res => {
        if (res.code === '00000') {
          this.confirmVisble = false
          this.updata()

        }
      })
    },
    handleSizeChange(val) {
      this.pageSize = val
      this.getpor()
    },
    // 第几页
    handleCurrentChange(val) {
      this.pageNo = val
      this.getpor()
    },
  }
}
</script>

<style scoped>
.toptitle {
  margin-right: 30px;
}

.main_style {
  background: #fff;
  padding: 10px;
}

.el-table /deep/ .cell {
  line-height: 30px;
}

.title1 {
  margin-bottom: 20px;
}

.checked {
  margin-left: 30px;
}
</style>
